<template>
    <div class="messageBox">
        {{msg}}
    </div>
</template>

<script setup lang="ts">
import { defineProps } from "@vue/runtime-core";

defineProps({
    msg:{
        type:String,
        default:"成功！"
    }
})
</script>

<style scoped>
.messageBox{
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid #ebeef5;
    position: fixed;
    left: 50%;
    top: 20px;
    transform: translateX(-50%);
    background-color: #edf2fc;
    transition: opacity .3s,transform .4s,top .4s;
    overflow: hidden;
    padding: 15px 15px 15px 20px;
    display: flex;
    align-items: center;
}
</style>